TypeScript Deep DiveでTypeScriptに入門する

TypeScript Deep Dive とは

TypeScript Deep Diveとは、TypeScriptはもちろん、JavaScript（ES6）/ サーバーサイドJavaScript（Node.js）/ Reactなどで使うJSX など、TypeScript周辺技術を包括的に学ぶことができるTypeScriptの入門サイトです。

TypeScript Deep Dive

TypeScript Deep Dive 日本語版

GitHub TypeScript Deep Dive 日本語版

TypeScript環境構築

TypeScript Deep Diveで勉強を始めるための、環境構築を行なっていきます。

環境

項目	バージョン
macOS	Mojave 10.14.5

1. Node.jsのインストール

HomeBrewを使って、nodebrewをインストールします。

$ brew install nodebrew

nodebrewを使って、Node.jsの最新版をインストールします。

$ nodebrew install-binary latest

Node.jsがインストールされているか確認します。

$ node --version
v12.11.1
$ npm --version
6.11.3

2. TypeScriptのインストール

TypeScriptのコンパイラの最新版をインストールします。

$ npm install -g typescript@next

tscコマンドがインストールできたか確認します。

$ tsc --version
Version 3.7.0-dev

3. Visual Studio Codeのプラグインをインストール

エディタはなんでもいいですが、Visual Studio Codeを使います。また、TypeScript Deep Diveでオススメされている以下のプラグインをVisual Studio Codeにインストールします。

TypeScript God

4. GitHubからソースコードをクローン

TypeScript Deep Diveに書かれているソースコードは、GitHubに公開されているため、そのサンプルコードをクローンします。

git clone https://github.com/yohamta/typescript-book-jp.git

勉強方法

個人的には上のメニューから順番に読んでいって、適宜Visual Studio Codeでサンプルコードを写経して勉強していきました。JavaScriptの復習にもなりますし、写経することでコピペするよりも効率よく構文などを覚えることができると思います。

おわりに

以上、TypeScript Deep Diveの紹介でした。TypeScriptをこれから勉強しようと思っている方に非常にオススメです！